<template>
  <div id="top">
      <img src="../assets/img/index/logo.png">
      <el-menu
       :default-active="active"
       class="el-menu-demo"
       mode="horizontal" @select="menuSelect">
        <el-menu-item index='homePage' route='/homePage'>
            <p>首页</p>
            <p class='span'>Home</p>
        </el-menu-item>
        <el-menu-item index="productsAndSolutions" route='/productsAndSolutions'>
          <p>产品与方案</p>
          <p class='span'>Products &amp; Solutions</p>
        </el-menu-item>
        <el-menu-item index="service" route='/service'>
          <p>产品服务</p>
          <p class='span'>Service</p>
        </el-menu-item>
        <el-menu-item index="aboutUs" route='/aboutUs'>
          <p>关于我们</p>
          <p class='span'>About Us</p>
        </el-menu-item>
      </el-menu>
    </div>
</template>

<script>
export default {
  name: 'top',
  props: [
    'active'
  ],
  methods: {
    menuSelect (index) {
      this.$emit('menuSelect',index)
    }
  },
}
</script>

<style lang="scss">
</style>